<template>
  <!-- 采购明细留言 -->
  <a-spin class="purchase-comment-wrap" :loading="getLoading">
    <a-empty v-if="!storageList.length" />
    <div class="info-item" v-for="(item, i) in storageList" :key="i">
      <ul class="flex flex-wrap">
        <li v-for="(desc, j) in item.descList" :key="j">
          <span class="label">{{ desc.label }}：</span>
          <span :class="desc.class">{{ desc.value }}</span>
        </li>
      </ul>
    </div>
  </a-spin>
</template>

<script lang="ts" setup>
  import { ref, getCurrentInstance } from 'vue'
  import { getReceiptItemByPlan } from '@/api/purchaseApplication'

  const props = defineProps({
    currentData: {
      type: Object,
      default: () => {},
    },
  })
  const storageList = ref<Array<any>>([])
  const getLoading = ref(false)
  const { proxy } = getCurrentInstance()

  // 获取留言列表
  async function getStorageList() {
    if (!props.currentData.id) return
    storageList.value = []
    getLoading.value = true
    let res: any = await getReceiptItemByPlan({
      id: props.currentData.id,
    })
    getLoading.value = false
    let list = res?.data || []
    list.forEach((el: any) => {
      let obj = {
        descList: [
          { label: '入库单号', value: el.receiptNo, class: 'highlight' },
          { label: '申购单号', value: el.planNo, class: '' },
          { label: '收货仓', value: el.warehouseName, class: '' },
          { label: '签收人', value: el.warehouseUname, class: '' },
          { label: '申购人', value: el.salesmanName, class: '' },
          { label: '采购员', value: el.purchaseUname, class: '' },
          { label: '专属店铺', value: el.shopName, class: '' },
          { label: '创建时间', value: proxy.$setTime(el.gmtCreate), class: '' },
          { label: '入库数量', value: el.warehouseAmt, class: '' },
          { label: '签收时间', value: proxy.$setTime(el.gmtFinished), class: '' },
          { label: '实际签收数量', value: el.warehouseRealAmt, class: '' },
          { label: '入库材质重量', value: el.materialWeight, class: '' },
          { label: '材质单价', value: '￥' + el.materialPrice, class: '' },
          { label: '实收材质重量', value: el.materialRealWeight, class: '' },
          { label: '工费单价', value: '￥' + el.laborPrice, class: '' },
          { label: '产品单价', value: '￥' + el.productPrice, class: '' },
          { label: '材质金额', value: '￥' + el.materialAmount, class: '' },
          { label: '税率', value: `${el.rate}%(${el.priceType === 1 ? '含税' : '不含税'})`, class: '' },
          { label: '工费', value: '￥' + el.laborAmount, class: '' },
          { label: '产品金额', value: '￥' + el.productAmount, class: '' },
          { label: '合计金额', value: '￥' + el.totalAmount, class: '' },
          { label: '其他费用', value: '￥' + el.otherAmount, class: '' },
          { label: '单件货值', value: '￥' + el.singleAmount, class: '' },
          { label: '税金', value: '￥' + el.taxAmount, class: '' },
        ],
      }
      storageList.value.push(obj)
    })
  }
  getStorageList()
</script>

<style lang="less" scoped>
  .purchase-comment-wrap {
    overflow: hidden;
    height: 100%;
    width: 100%;
    overflow-y: auto;
    .info-item {
      border-bottom: 1px solid #ddd;
      padding-bottom: 15px;
      margin-bottom: 5px;
    }
    li {
      width: 50%;
      margin-top: 10px;
    }
    .label {
      color: #888;
    }
  }
</style>
